<!DOCTYPE html>
<html lang="zh">
<head>
    <th:block th:include="include :: header('手动执行')" />
    <th:block th:include="include :: datetimepicker-css" />
    <th:block th:include="include :: select2-css" />
    <style>
        .col-md-6
    </style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content">
    <div class="row">
        <div class="col-md-4" style="background-color: #fff;min-height:550px;"> <!--style="font-size:16px;margin-top:6px;"-->
            <form class="form-horizontal m" id="form-db-add">
            <div class="form-group">
                <label class="col-sm-2 control-label" style="font-size:14px;text-align: right;padding-left: 0px">日期：</label>
                <div class="col-sm-10">
                    <div class="input-daterange input-group">
                        <input type="text" class="input-sm form-control" id="laydate-startTime" placeholder="yyyy-MM-dd" autocomplete="off"/>
                        <span class="input-group-addon">到</span>
                        <input type="text" class="input-sm form-control" id="laydate-endTime" placeholder="yyyy-MM-dd" autocomplete="off"/>
                    </div>
                </div>
            </div>
            <div class="form-group" style="margin-top: 15px">
                <label class="col-sm-2 control-label" style="font-size:14px;text-align: right;padding-left: 0px">类型：</label>
                <div class="col-sm-7">
                    <select name="sdExeccls" id="sdExeccls" class="form-control m-b" th:with="type=${@baseSd.getItem('hand_execcls')}" onchange="clsChange()">
                        <option th:each="item : ${type}" th:text="${item.na}" th:value="${item.cd}"></option>
                    </select>
                </div>
                <div class="col-sm-3">
                    <a class="btn btn-primary single" onclick="exec()" shiro:hasPermission="system:msg:edit">
                        <i class="glyphicon glyphicon-hand-up"></i> 执行
                    </a>
                </div>
            </div>
            </form>
            <table id="bootstrap-table"></table>
        </div>
        <div class="col-md-8" style="padding-right: 0px">
            显示当前执行/等待中的任务与最近30条手工执行的任务
            <div class="col-sm-12 select-table table-striped">
                <table id="tableExecList"></table>
            </div>
        </div>
    </div>
</div>
<th:block th:include="include :: footer" />
<th:block th:include="include :: datetimepicker-js" />
<th:block th:include="include :: select2-js" />
<script type="text/javascript">
    var prefix = ctx + "etl/exec";
    function clsChange() {
        loadMainTable();
        $("#tableExecList").bootstrapTable('destroy');
        loadLogDetail();
    }
    function exec() {
        var startDate=$("#laydate-startTime").val();
        var endDate=$("#laydate-endTime").val();
        var type=$("#sdExeccls").val();
        if(startDate=="" || endDate=="") {
            $.modal.alertError('请确保开始日期结束日期完整！');
            return ;
        }
        if(startDate>endDate) {
            $.modal.alertError('开始日期须小于结束日期！');
            return ;
        }
        var idTasks="";
        var rows = $("#"+table.options.id).bootstrapTable('getSelections');
        if(rows.length==0) {
            $.modal.alertError('请至少选择一条执行数据！');
            return ;
        }
        $.each(rows,function (index,item) {
            idTasks += item.id+",";
        });
        //startDate = new Date(Date.parse(startDate.replace(/-/g, "/")));
        //endDate = new Date(Date.parse(endDate.replace(/-/g, "/")));
        var param={"startDay":startDate,"endDay":endDate,"idTasks":idTasks.substring(0,idTasks.length-1),"type":type};
        $.ajax({
            url: prefix+"/jobExecByHand",
            cache: false,
            type: 'POST',
            dataType: 'json',
            data: JSON.stringify(param),
            contentType: 'application/json;charset=UTF-8',
            success: function (result) {
                debugger;
                if(result.code==0) {
                    $.modal.alertSuccess('完成执行！');
                } else {
                    $.modal.alertError(result.msg);
                }
            }
        });
    };
    function showDetail(idExec,na) {
        var options = {
            title: na,
            width: "900",
            height: "720",
            url: prefix+"/showDetail/"+idExec,
            callBack: doSubmit
        };
        $.modal.openOptions(options);
    }
    function doSubmit() {

    }

    function loadMainTable() {
        $("#bootstrap-table").bootstrapTable('destroy');
        var options = {
            url: prefix + "/query/"+$("#sdExeccls").val(),
            method:"get",
            modalName: "执行数据",
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            columns: [{
                checkbox: true
            },
                {
                    field: 'id',
                    title: '主键',
                    visible: false
                },
                {
                    field: 'table',
                    title: '目标表'
                },
                {
                    field: 'des',
                    title: '名称'
                }]
        };
        $.table.init(options);
    }

    function loadLogDetail() {
        $('#tableExecList').bootstrapTable({
            url: prefix+"/queryExec/"+$("#sdExeccls").val()+"/1",
            method:"get",
            pagination: true,
            search: false,
            showRefresh: true,
            columns: [{
                field: 'idExec',
                title: '主键',
                visible: false
            },
                {
                    field: 'na',
                    title: '参数'
                },
                {
                    field: 'dtBegin',
                    title: '开始时间',
                    sortable: true
                },
                {
                    field: 'times',
                    title: '耗时(s)'
                },
                {
                    field: 'euStatus',
                    title: '状态',
                    formatter: function(value, item, index) {
                        if (item.euStatus == "COMPLETED") {
                            return "完成";
                        } else if (item.euStatus == "STARTING" || item.euStatus == "STARTED" || item.euStatus == "UNKNOWN") {
                            return "进行中";
                        } else if (item.euStatus == "STOPPED" || item.euStatus == "STOPPING") {
                            return "暂停";
                        } else if (item.euStatus == "FAILED") {
                            return "失败";
                        } else if (item.euStatus == "ABANDONED") {
                            return "异常结束";
                        }
                    }
                },
                {
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs " href="javascript:void(0)" onclick="showDetail(\'' + row.idExec + '\',\''+row.na+'\')"><i class="glyphicon glyphicon-eye-open"></i>详情</a> ');
                        if(row.euStatus=="进行中") {
                            actions.push('<a class="btn btn-danger btn-xs " href="javascript:void(0)" onclick="showDetail(\'' + row.idExec + '\',\''+row.na+'\')"><i class="glyphicon glyphicon-eye-open"></i>停止</a> ');
                        }
                        return actions.join('');
                    }
                }]
        });
    }
    $(function(){
        loadMainTable();
        loadLogDetail();
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            var now = new Date();
            var startDate = laydate.render({
                elem: '#laydate-startTime',
                max: now.getFullYear()+"-"+(now.getMonth() + 1)+"-"+now.getDate(),
                theme: 'molv',
                trigger: 'click'
            });
            var endDate = laydate.render({
                elem: '#laydate-endTime',
                max: now.getFullYear()+"-"+(now.getMonth() + 1)+"-"+now.getDate(),
                theme: 'molv',
                trigger: 'click'
            });
        });
    });
</script>
</body>
</html>